<template>
  <div>
    <el-container>
      <el-aside width="200px">
          <el-row>
            <el-col :span="6" >
              <span class="bg"></span>
            </el-col>
            <el-col :span="18">
              <span class="txt">再生道后端</span>
            </el-col>
          </el-row>
          <el-row id="ta">
            <el-col :span="24">
              <el-menu
                    default-active="2"
                    class="el-menu-vertical-demo"
                    @open="handleOpen"
                    @close="handleClose">
                    <el-submenu v-for="item in menu" :key="item.id" :index="item.id">
                      <template #title>{{ item.name }}</template>
                      <el-menu-item v-for="subItem in item.children" :key="subItem.id" :index="(subItem.id).toString()" @click="handleClick(subItem.resourceUrl)">
                        {{ subItem.name }}
                      </el-menu-item>
                    </el-submenu>
                    <!-- <el-submenu index="1">
                      <template slot="title">
                        <i class="el-icon-s-tools"></i>
                        <span>系统管理</span>
                      </template>
                        <el-menu-item index="1-1"><router-link to="/login" class="text">退出登录</router-link></el-menu-item>
                    </el-submenu>
                    <el-submenu index="2">
                      <template slot="title">
                        <i class="el-icon-user-solid"></i>
                        <span>个人中心</span>
                      </template>
                        <el-menu-item index="2-1" ><router-link to="/informationone" class="text">个人信息</router-link></el-menu-item>
                    </el-submenu>
                    <el-submenu index="3">
                      <template slot="title">
                        <i class="el-icon-s-order"></i>
                        <span>业务中心</span>
                      </template>
                        <el-menu-item index="3-1"><router-link to="/announcement" class="text">公告管理</router-link></el-menu-item>
                        <el-menu-item index="3-2"><router-link to="/userManaement" class="text">用户管理</router-link></el-menu-item>
                        <el-menu-item index="3-3"><router-link to="/driver" class="text">司机管理</router-link></el-menu-item>
                        <el-menu-item index="3-4"><router-link to="/application" class="text">申请管理</router-link></el-menu-item>
                        <el-menu-item index="3-5"><router-link to="/order" class="text">订单管理</router-link></el-menu-item>
                        <el-menu-item index="3-6"><router-link to="/vehicle" class="text">车辆管理</router-link></el-menu-item>
                    </el-submenu> -->
                  </el-menu>
            </el-col>
          </el-row>
      </el-aside>
      <el-main >
        	<router-view/>
      </el-main>
    </el-container>
  </div>
</template>

<script>
  export default{
    name:"menu",
    data(){
    	return{
        menu:{},
        accountId:sessionStorage.getItem("loginUser")
    	}
    },
    methods:{
      handleClick(url) {
        // 在点击菜单项时执行相应的操作，例如页面跳转
        this.$router.push(url);
      },

      findMenu(){
        this.$http.get("/permissions/tMenu/myMenu").then(resp=>{
          console.log(resp.data)
        this.menu=resp.data.data
        })
      },
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      }
    },created() {
      this.findMenu();
    }
  }
</script>

<style scoped>

</style>
